/**
* 简介 - 组建
*/
<template>
  <div style="margin-bottom:20px;">
    <div class="h-introduction" v-if="terminal === 'pc'">
      <!-- 简介 -->
      <div class="h-hidden">
        <aside class="h-aside fl">
          <img src="@/assets/img/zuanjie1.jpg"  />
        </aside>
        <article class="h-article fr">
          <div class="h-model-title">
            <h3>金友福 简介</h3>
            <p>ABOUT 金友福</p>
          </div>
          <div class="h-info">
            金友福珠宝有限公司创立于上世纪90年代初，是一家集成品采购、品牌连锁运营、终端销售为一体的综合性大型连锁珠宝公司。主营产品有：黄金饰品、铂金饰品、K金饰品、翡翠玉器、金镶玉、钻石镶嵌、银饰品等。
  
  -  金友福前身为香港金友福有限公司。2003-2013年间先后于天津、深圳成立分公司，金友福珠宝有限公司发展至今，旗下零售网点遍布天津、北京、河北、湖南等地。
  
  金友福珠宝有限公司自创立以来，一直秉承着顾客至上、服务为先、诚信经营的理念，真正打造属于老百姓的品牌，金友福一直坚持贯彻“引领钻石升值，专注平价黄金“的营销理念。通过精业与创新、不断进取与努力，在品牌经营、发展规模、产品结构等方面不断突破，现已成为珠宝行业内的中坚力量，发展成为国内知名珠宝品牌之一，并赢得了政府有关部门和社会各界的一致肯定和大力支持。
  
  总部设在香港的金友福珠宝是一家大型珠宝连锁企业，实力雄厚、发展潜力无限，是天津黄金协会的长期战略合作伙伴。金友福珠宝拥有独特的营销运作模式。本公司对优秀人才实行优厚的高于行业水准的薪酬与广阔的事业发展空间，并提供相关保险等福利。
          </div>
        </article>
      </div>
      <!-- 通栏 - 精湛工艺 -->
      <div class="h-ship">
        <div class="h-ship-info">
          <div class="h-model-title">
            <h3>金友福 精湛工艺</h3>
            <p class="white">金友福 CRAFTSMANSHIP</p>
          </div>
          <p class="h-ship-text">
            每一件金友福珠宝的诞生都源于一个生活梦想，对爱情，家庭，事业，人生的梦想，金友福珠宝致力于将这种生活的憧憬为万千女性呈现出来，传递下去。金友福珠宝“不仅设计时尚珠宝，更懂设计生活梦想”。
          </p>
        </div>
        <img src="@/assets/img/next2.jpg"  />
      </div>
      <!-- 品牌寓意 -->
      <!-- <div class="h-model-title mtb50">
        <h3>金友福 品牌寓意</h3>
        <p>金友福 BRAND MEANING</p>
      </div>
      
      <div class="h-meaning">
        <p class="h-mean-text">
          金友福珠宝自创立之初，就一直倡导乐观、积极的生活态度，倡导一种追求闪耀人生的态度。它希冀用最璀璨夺目的美饰作为载体，将人类美好的情感和世间珍贵的祝福表现出来，让金友福珠宝妆点人们的容颜，照亮人们的梦想，继而使他们获得追求闪耀、找寻真爱、追求幸福的激情与动力，从而缔造闪耀人生！
        </p>
        <img src="@/assets/img/next2.jpg"  />
      </div> -->
    </div>
    <!-- 移动端 -->
    <div v-else class="h-intro-ph">
      <div class="h-model-title mtb20">
        <h3>金友福 简介</h3>
        <p>ABOUT 金友福</p>
      </div>
      <p class="h-mean-text">
          金友福珠宝有限公司创立于上世纪90年代初，是一家集成品采购、品牌连锁运营、终端销售为一体的综合性大型连锁珠宝公司。主营产品有：黄金饰品、铂金饰品、K金饰品、翡翠玉器、金镶玉、钻石镶嵌、银饰品等。
  
  -  金友福前身为香港金友福有限公司。2003-2013年间先后于天津、深圳成立分公司，金友福珠宝有限公司发展至今，旗下零售网点遍布天津、北京、河北、湖南等地。
  
  金友福珠宝有限公司自创立以来，一直秉承着顾客至上、服务为先、诚信经营的理念，真正打造属于老百姓的品牌，金友福一直坚持贯彻“引领钻石升值，专注平价黄金“的营销理念。通过精业与创新、不断进取与努力，在品牌经营、发展规模、产品结构等方面不断突破，现已成为珠宝行业内的中坚力量，发展成为国内知名珠宝品牌之一，并赢得了政府有关部门和社会各界的一致肯定和大力支持。
  
  总部设在香港的金友福珠宝是一家大型珠宝连锁企业，实力雄厚、发展潜力无限，是天津黄金协会的长期战略合作伙伴。金友福珠宝拥有独特的营销运作模式。本公司对优秀人才实行优厚的高于行业水准的薪酬与广阔的事业发展空间，并提供相关保险等福利。
      </p>
      <img src="@/assets/img/next2.jpg"  />
      
      <div class="h-model-title mtb20" style="color:#fff;">
        <h3>金友福 精湛工艺</h3>
        <p class="white">金友福 CRAFTSMANSHIP</p>
      </div>
      <p class="h-mean-text">
         每一件金友福珠宝的诞生都源于一个生活梦想，对爱情，家庭，事业，人生的梦想，金友福珠宝致力于将这种生活的憧憬为万千女性呈现出来，传递下去。金友福珠宝“不仅设计时尚珠宝，更懂设计生活梦想”。
      </p>
      <!-- <img src="@/assets/img/next2.jpg"  />
      
      <div class="h-model-title mtb20">
        <h3>金友福 品牌寓意</h3>
        <p>金友福 BRAND MEANING</p>
      </div>
      <p class="h-mean-text">
          金友福珠宝自创立之初，就一直倡导乐观、积极的生活态度，倡导一种追求闪耀人生的态度。它希冀用最璀璨夺目的美饰作为载体，将人类美好的情感和世间珍贵的祝福表现出来，让金友福珠宝妆点人们的容颜，照亮人们的梦想，继而使他们获得追求闪耀、找寻真爱、追求幸福的激情与动力，从而缔造闪耀人生！
      </p>
      <img src="@/assets/img/next2.jpg"  /> -->
    </div>
  </div>
</template>
<script>
import { footerList } from '@/mock' // 脚部数据
import { footerData } from '@/api'

export default {
  name: 'Introduction',
  props: {},
  data () {
    return {
      terminal: '', // 终端类型
      footerData: [],
    }
  },
  created () {
    this.terminal = localStorage.getItem('terminalm')
    console.log('this.terminal***', this.terminal)
    // this.getFooterData() // 底部数据加载
  },
  mounted () {
    this.footerData = footerList.result // 使用接口时 此处删除
  },
  methods: {
    getFooterData () {
      const params = { // 请求参数 --- 根据情况 是否需要
        id: '111'
      }
      footerData(params).then(res => {
        this.footerData = res
      })
    }
  }
}
</script>

<style lang="scss" scoped>
  .h-introduction {
    .h-aside{
      width: auto;
      height: 400px;
      margin-top: 25px;
      img{
        width: 100%;
        height: 100%;
      }
    }
    .h-article{
      width: 610px;
    }
    .h-info{
      margin-top: 10px;
      color: #333;
      text-indent: 2em;
      line-height: 20px;
      letter-spacing: 2px;
    }
    /* 通栏 - 精湛工艺 - 部分 */
    .h-ship{
      position: relative;
      height: 350px;
      margin-top: 30px;
      color: #fff;
      .h-model-title{
        margin: 50px auto 30px auto;
        h3{
           font-weight: bold !important;
        }
        .white{
          color: #fff !important;
        }
      }
      h3{
        color: #fff;
        border-color: #fff;
      }
      .h-ship-info{
        position: absolute;
        left: 50px;
        width: 380px;
        height: 100%;
        letter-spacing:2px
      }
      img{
        width: 100%;
        height: 100%;
      }
    }
    /* 通栏 - 品牌寓意 - 部分 */
    .h-meaning{
      position: relative;
      height: 400px;
      margin-bottom: 30px;
      img{
        width: 100%;
        height: 100%;
      }
      .h-mean-text{
        position: absolute;
        width: 300px;
        padding: 100px;
        line-height: 25px;
        color: #fff;
      }
    }
  }
  /* 移动端 */
  .h-intro-ph{
    padding: 0 15px;
    img{
      width: 100%;
      margin: 10px auto;
    } 
  }
</style>
